<template>
	<view class="after">
		<view v-if="dataobj.refund_show">
			<view class="after_head bg-cover font-ffffff font16">{{dataobj.typename}}</view>
			<view class="after_address">
				<view class="flex-row-between">
					<view class="font-1e1e1e font15 font-b">收件人信息</view>
					<view class="address_copy font-646464 font13 flex-row-center" @click="Oncopy">一键复制</view>
				</view>
				<view class="address_info font13">
					<text class="font-1e1e1e">{{groupobj.addr_name}}</text>
					<text class="font-969696 margin-10">{{groupobj.addr_phone}}</text>
					<view class="addressI_fo">
						{{groupobj.addr_address}}
					</view>
				</view>
				<view class="address_text font-969696 font12">
					<view class="margin-10">*未与卖家协商一致的情况下，请勿寄到付或平邮</view>
					<view>*请填写真实有效的物流信息</view>
				</view>
			</view>
			<!-- 快递公司 -->
			<view class="after_express flex-column-between" v-if="goodsobj.goods_type==10">
				<view class="express_bos flex-row-between" @click="Onopen">
					<view class="font-1e1e1e font14 express_name">快递公司</view>
					<view class="express_box flex-row-end">
						<view class="font14" :class="addressobj.code?'font-646464':'font-b4b4b4'">
							{{addressobj.code?addressobj.name:'请选择快递公司'}}
						</view>
						<image v-if="dataobj.refund_status == '30'"
							src="https://static.newbeaconhotels.com/app/hotel/group/more.png" mode=""></image>
					</view>
				</view>
				<view class="express_bos flex-row-between">
					<view class="font-1e1e1e font14 express_name">快递单号</view>
					<view class="express_box flex-row-end">
						<input v-if="dataobj.refund_status == '30'" class="font14 font-1e1e1e" @input="OnNumbers"
							:value="addressobj.number" placeholder="请填写快递单号" maxlength="30"
							placeholder-class="placeholderClass" />
						<view v-else class="font14 font-646464">{{dataobj.refund_logistics}}</view>
					</view>
				</view>
			</view>
		</view>
		<view :style="{top:dataobj.refund_status != '20'?'-40rpx':'0rpx'}" class="after_all">
			<!-- 信息 -->
			<view class="afterSale_title flex-row-start">
				<image class="afterST_back" :src="goodsobj.logo" mode=""></image>
				<view class="afterST_bos flex-column-between">
					<view class="font-1e1e1e font14 mutiple-ellipsis3">{{goodsobj.goods_name}}</view>
					<view class="flex-row-between">
						<view class="font-969696 font13">规格：{{goodsobj.spec_type==10?'默认':goodsobj.goods_attr}}</view>
						<view class="font-969696 font13">x{{goodsobj.total_num}}</view>
					</view>
				</view>
			</view>
			<view class="after_details flex-column-between">
				<view class="express_bos font14 flex-row-start">
					<view class="font-1e1e1e details_name">售后状态</view>
					<view class="font-646464 details_info">{{dataobj.typename}}</view>
				</view>
				<view class="express_bos font14 flex-row-start">
					<view class="font-1e1e1e details_name">售后类型</view>
					<view class="font-646464 details_info">退货退款</view>
				</view>
				<view class="express_bos font14 flex-row-start">
					<view class="font-1e1e1e details_name">退款金额</view>
					<view class="font-ff3c37 details_info">{{goodsobj.goods_price}}</view>
				</view>
				<view class="express_bos font14 flex-row-start">
					<view class="font-1e1e1e details_name">申请原因</view>
					<view class="font-646464 details_info">{{dataobj.refund_reason?dataobj.refund_reason:'暂无'}}</view>
				</view>
			</view>
		</view>
		<!-- 提交按钮 -->
		<view class="comment_submit flex-row-center font-ffffff font15" @click="OnfeedBack"
			v-if="dataobj.refund_status == '30'">
			<view class="flex-row-center">确认发货</view>
		</view>
		<view class="comment_submitx" v-if="dataobj.refund_status == '30'"></view>
		<!-- 快递公司选择 -->
		<Compicker ref="breakfast" mode="name" @callback="breakfastChange"></Compicker>
	</view>
</template>


<script>
	import Compicker from "@/components/j-Compicker/index.vue";
	export default {
		components: {
			Compicker
		},
		data() {
			return {
				code: '', //订单code
				groupobj: {}, //收货地址
				dataobj: {}, //总数据
				goodsobj: {}, //商品数据
				imgFullUrl: this.$Config.http_static, //图片地址
				companyList: [], //物流公司
				//提交物流
				addressobj: {
					code: '',
					name: '',
					number: ''
				}
			}
		},
		onLoad: function(options) {
			let query = {}
			if (this.$Route.query.scene) {
				query = this.$base.OnWxoptions(this.$Route.query.scene)
			}else{
				query = options
			}
			this.code = query.code
			//详情
			this.OnOrder()
		},
		methods: {
			//详情
			OnOrder() {
				this.$Http({
					url: 'detailsOrder',
					token: true,
					type: 'POST',
					data: {
						order_code: this.code
					},
				}).then(res => {
					if (res.code == 1) {
						if (res.data.order_status == 70) {
							res.data.typename = '已同意售后，已退款'
							res.data.refund_show = true

						} else {
							if (res.data.refund_status == '20') {
								res.data.typename = '售后审核中'
								res.data.refund_show = false
							}
							if (res.data.refund_status == '30') {
								res.data.typename = '已同意售后，请及时发货'
								res.data.refund_show = true
							}
							if (res.data.refund_status == '40') {
								res.data.typename = '已同意售后，已发货'
								res.data.refund_show = true
							}
							if (res.data.refund_status == '50') {
								res.data.typename = '已同意售后，等待财务打款'
								res.data.refund_show = true
							}
						}
						res.data.order_goods.logo = this.imgFullUrl + res.data.order_goods.logo
						this.dataobj = res.data
						this.goodsobj = res.data.order_goods
						this.addressobj.number = res.data.refund_logistics
						//物流
						this.OnCompany()
						//收货地址
						this.OngroupBuy()
					}
				});
			},
			//收货地址
			OngroupBuy() {
				this.$Http({
					url: 'groupBuy',
					data: {},
				}).then(res => {
					if (res.code == 1) {
						this.groupobj = res.data
					}
				});
			},
			//物流公司名字
			OnCompany() {
				this.$Http({
					url: 'logisticsCompany',
					data: {},
				}).then(res => {
					if (res.code == 1) {
						let index_is = 'false'
						res.data.forEach((item, index) => {
							if (item.code == this.dataobj.refund_logistics_company) {
								this.addressobj.name = item.name
								this.addressobj.code = item.code
								index_is = index
							}
						})
						index_is = index_is == 'false' ? 0 : index_is
						this.$nextTick(() => {
							this.$refs.breakfast.Ondata(res.data, index_is)
						})
						this.companyList = res.data
					}
				});
			},
			//打开物流
			Onopen() {
				if (this.dataobj.refund_status == '30') {
					this.$refs.breakfast.Onopen()
				}
			},
			//返回物流
			breakfastChange(e) {
				this.addressobj.code = e.code
				this.addressobj.name = e.name
			},
			//单号
			OnNumbers(e) {
				this.addressobj.number = e.detail.value
			},
			//复制地址
			Oncopy(orderNumber) {
				let data = '收货姓名:' + this.groupobj.addr_name + '收货电话:' + this.groupobj.addr_phone + '收货地址:' + this.groupobj
					.addr_address
				// #ifdef H5
				let result = this.$base.h5Copy(data)
				if (result == false) {
					uni.showToast({
						title: '不支持',
						icon: 'none'
					})
				} else {
					uni.showToast({
						title: '复制成功'
					})
				}
				// #endif

				// #ifndef H5
				uni.setClipboardData({
					data: data,
					success: () => {
						uni.showToast({
							title: '复制成功'
						})
					}
				})
				// #endif
			},
			//提交物流
			OnfeedBack() {
				let that = this
				if (this.addressobj.name == '' || this.addressobj.number == '') {
					uni.showToast({
						icon: 'none',
						duration: 2000,
						title: '请填写物流'
					});
					return
				}
				this.$Http({
					url: 'afterSaleDelivery',
					token:true,
					type:'POST',
					data: {
						order_id: this.dataobj.id,
						refund_logistics_company: this.addressobj.code,
						refund_logistics: this.addressobj.number
					},
				}).then(res => {
					if (res.code == 1) {
						uni.showModal({
							title: '操作提示',
							content: '提交成功',
							confirmText: '我知道了',
							confirmColor: '#ff3c37',
							showCancel: false,
							success(res) {
								if (res.confirm) {
									that.$Router.replace('/pages/group/orderList')
								}
							}
						})
					} else {
						uni.showToast({
							icon: 'none',
							duration: 2000,
							title: res.msg
						});
					}
				});
			},
			//放大图片
			Onpreview(e) {
				uni.previewImage({
					current: e, //预览图片的下标
					urls: this.imglist //预览图片的地址，必须要数组形式，如果不是数组形式就转换成数组形式就可以
				})
			}
		}
	}
</script>

<style lang="less">
	@import url("style.less");
</style>
